{extend name="layout/iframe" /}

{block name="content"}
<div class="layui-card-body layui-layout-admin" style="padding: 15px;">
    <blockquote class="layui-elem-quote quoteBox">
        <form class="layui-form h between">
            <div class="layui-inline searchBox">
                <div class="layui-input-inline">
                    <input type="text" class="layui-input name" name="name" placeholder="请输入商品名" />
                </div>
                <input type="text" class="layui-input" value="阻止回车键提交" style="display: none;">
                <a class="layui-btn search_btn" data-type="reload">搜索</a>
                <button type="reset" class="layui-btn layui-btn-danger reset_btn"><i class="layui-icon">&#xe669;</i></button>
            </div>
            <div class="layui-inline">
            </div>
        </form>
    </blockquote>

    <form class="layui-form" action="" lay-filter="component-form-group">
        <table id="dataTable" lay-filter="dataTable"></table>
    </form>
</div>

<input type="hidden" class="product_type" value="{$param.type}">
<input type="hidden" class="datalist_url" value="{:url('admin/buygifts/selectproducts', ['type' => $param['type']])}">
<input type="hidden" class="check_used_url" value="{:url('admin/'.strtolower($model).'/checkUsed')}">
{/block}

{block name="pagescript"}
<script type="text/javascript">
    layui.use(['form', 'layer', 'table'], function(){

        var form = layui.form,
            layer = parent.layer === undefined ? layui.layer : top.layer,
            $ = layui.jquery,
            table = layui.table;

        var datalist_url = $('.datalist_url').val();
        var product_type = $('.product_type').val();
        var check_used_url = $('.check_used_url').val();


        /*if (product_type == 'buy') {
            datalist_url += '?product_id=' + $(parent.window.frames[0].document).find('.buy_product_id').val();
        } else {
            datalist_url += '?product_id=' + $(parent.window.frames[0].document).find('.gift_product_id').val();
        }*/
        // Table 列表
        var tableIns = table.render({
            elem: '#dataTable',
            url : datalist_url,
            page : true,
            cellMinWidth : 95,
            //height : "full-100",
            limit : 10,
            limits : [10, 20, 50, 100],
            id : "tableList",
            cols : [[
                {field: 'img_url', title: '封面图', minWidth:80, align:"center", templet:function(data){
                    return '<a href="'+data.img_url+'" target="_blank"><img src="'+data.img_url+'" style="width: 80px;" /></a>';
                }},
                {field: 'name', title: '商品名称', minWidth:140},
                {field: 'bar_code', title: '条码', align:'center', minWidth:140},
                {field: 'category_id', title: '分类', align:'center'},
                {field: 'qty', title: '库存', align:'center'},
                {field: 'price', title: '售价', align:'center', templet:function(data){
                    return data.price / 100;
                }},
                {title: '操作', fixed:"right", align:"center", minWidth:100, templet:function(data){
                    var html = '';
                    html += '<button type="button" class="layui-btn layui-btn-sm select-btn" lay-event="select">选取</button>';
                    return html;
                }}
            ]],
            done: function(res, curr, count){
                var data = res.data;
                if (product_type == 'buy') {
                    var product_id = $(parent.window.frames[0].document).find('.buy_product_id').val();
                } else {
                    var product_id = $(parent.window.frames[0].document).find('.gift_product_id').val();
                }
                for(var i=0; i<data.length; i++){
                    if (data[i].id == product_id) {
                        var index = res.data[i]['LAY_TABLE_INDEX'];
                        $('tr[data-index=' + index + ']').find('.select-btn').addClass('layui-btn-normal');
                        $('tr[data-index=' + index + ']').find('.select-btn').prop('disabled', true);
                        $('tr[data-index=' + index + ']').find('.select-btn').text('已选中');
                    }
                }
            }
        });

        // 搜索
        $(".search_btn").on("click", function(){
            if($('.name').val() != ''){
                table.reload("tableList", {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                    where: {
                        name: $('.searchBox').find('input[name=name]').val()  // 搜索的关键字
                    }
                });
            }else{
                layer.msg("请输入搜索的内容");
            }
        });

        // 清空搜索
        $(".reset_btn").on("click", function(){
            table.reload("tableList", {
                where: {
                    name: ''
                }
            });
        });

        // 列表操作
        table.on('tool(dataTable)', function(obj){
            var layEvent = obj.event,
                data = obj.data;

            if (layEvent == 'select') {
                // 确认选中
                if (product_type == 'buy') {
                    var url = check_used_url;
                    $.ajax({
                        url: url,
                        type: 'POST',
                        data: {'product_id': data.id},
                        dataType : 'json',
                        success: function (res) {
                            if(res.code != 1){
                                layer.msg(res.msg, {icon: 7});
                            }else{
                                $(parent.window.frames[0].document).find('.buy_product_id').val(data.id);
                                $(parent.window.frames[0].document).find('.buy_product_id').next('.select-products').text(data.name);

                                layer.msg('选择成功', {icon: 1, time: 1000});
                                var index = parent.layer.getFrameIndex(window.name);
                                layer.close(index);
                            }
                        }
                    });
                    return false;
                } else {
                    $(parent.window.frames[0].document).find('.gift_product_id').val(data.id);
                    $(parent.window.frames[0].document).find('.gift_product_id').next('.select-products').text(data.name);
                }

                layer.msg('选择成功', {icon: 1, time: 1000});
                var index = parent.layer.getFrameIndex(window.name);
                layer.close(index);
            }
        });
    });
</script>
{/block}